<template>
	<view class="content">
		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">添加设备</block>
		</cu-custom>
		<view class="login-btn">
			<text>请点击扫码按钮，扫描设备屏幕下方二维码，即可完成添加;若无扫码点击此处选择
				<text @tap="handAdd" class="text-link">手动添加</text>
			</text>
		</view>
		<view class="flex padding justify-center image-bg">
			<image mode="aspectFill" src="https://hafcapp.oss-cn-shanghai.aliyuncs.com/cs/background_add_device_small.jpg?Expires=1868637600&OSSAccessKeyId=LTAIA9VLEk1xfvBJ&Signature=oaC8HEU0BSjSe8S379WBcxlwOzA%3D"></image>
		</view>
		<view class="login-btn">
			<button class="landing" @click="startScan" type="primary">扫一扫</button>
		</view>
		
		<view class="cu-modal" :class="modalName=='InputDialog'?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content">添加设备</view>
					<view class="action" @tap="hideModal">
						<text class="cuIcon-close text-red"></text>
					</view>
				</view>
				<view class="padding dialog-bg">
					<view class="login-input">
						<input v-show="showDeviceId" type="text" @input="input" v-model="deviceId" placeholder="请输入序列号" />
					</view>
					<view class="login-input">
						<input type="text" @input="input" v-model="deviceName" placeholder="请输入设备名" />
					</view>
					<text class="notice-color">{{erroNotice}}</text>
				</view>
				<view class="cu-bar bg-white justify-end">
					<view class="action">
						<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
						<button class="cu-btn bg-green margin-left" @tap="startIncrease">确定</button>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	var jssdk =  require('components/node_modules/jweixin-module');
	export default {
		data() {
			return {
				modalName: null,
				deviceId: '',
				deviceName: '',
				erroNotice: '',
				link:'',
				showDeviceId:false
			}
		},
		onLoad(options) {
			console.log(options)
			if(typeof(options.link)!='undefined'){
				this.link = options.link
			}
		},
		methods: {
			startScan() {
				this.deviceId = ''
				this.showDeviceId = false
				this.erroNotice = ''
				//测试时使用
				if(getApp().globalData.debug){
					this.modalName = 'InputDialog'
					return
				}
				// 只允许通过相机扫码
				var that = this;
				jssdk.scanQRCode({
				  needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
				  scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码，默认二者都有
				  success: function (res) {
				    var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果
					//var params = result;
					var sn = result;
					if (sn != null && typeof(sn) != 'undefined') {
						that.deviceId = sn
						that.modalName = 'InputDialog'
					} else {
						uni.showToast({
							title: "无效二维码"
						})
					}
				  }
				});
			},
			handAdd(){
				this.deviceId = ''
				this.erroNotice = ''
				this.showDeviceId = true
				this.modalName = 'InputDialog'
			},
			input(res) {
				this.erroNotice = ''
			},
			hideModal(e) {
				this.modalName = null
			},
			startIncrease() {
				console.log(this.deviceName)
				
				if (this.deviceId == '') {
					this.erroNotice = '请输入序列号'
					return
				}
				if (this.deviceName == '') {
					this.erroNotice = '请输入设备名'
					return
				}
				var that = this
				that.modalName = ''
				uni.request({
					url: this.$constant.BASEURL + this.$constant.ADD_DEVICE,
					method: "POST",
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					data: {
						username: getApp().globalData.username,
						token: getApp().globalData.token,
						villageno: getApp().globalData.orgcode,
						deviceno: this.deviceId,
						addrname: this.deviceName
					},
					success: (res) => {
						console.log(res.data)
						if (res.data.code == 0) {
							uni.showToast({
								title: "添加成功",
							})
							uni.navigateTo({
								url:'setting?deviceId='+that.deviceId+'&link='+this.link
							})
						} else {
							uni.showToast({
								title: res.data.message,
								icon: "none"
							})
						}
					}
				});
			}
		}
	}
	/**
	 * 通过get链接获取到参数
	 */
	export const GetRequestParameters = (link) => {
		//通过？截取字符串
		var index = link.indexOf("?")
		var url = link.substr(index, link.length)
		//通过&获取参数
		let theRequest = new Object();
		if (url.indexOf("?") != -1) {
			let str = url.substr(1);
			let strs = str.split("&");
			for (let i = 0; i < strs.length; i++) {
				theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1]);
			}
		}
		return theRequest;
	}
</script>

<style>
	.image-bg{
		/* height: 50%; */
	}
	.login-btn {
		padding: 10upx 20upx;
		margin-top: 20upx;
	}

	.landing {
		height: 84upx;
		line-height: 84upx;
		border-radius: 44upx;
		font-size: 32upx;
		background: linear-gradient(left, #5599ff, #5599ff);
	}

	.dialog-bg {
		background-color: #FFFFFF;
	}

	.login-input input {
		background: #F2F5F6;
		font-size: 28upx;
		padding: 10upx 25upx;
		height: 80upx;
		line-height: 62upx;
		border-radius: 8upx;
	}

	.login-input {
		padding: 10upx 20upx;
	}

	.notice-color {
		color: #DD524D;
	}
	.text-link{
		font-size: 32upx;
		color: #007AFF;
		text-decoration: underline;
	}
</style>
